<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">

    <ui:composition template="/plantillas/plantillaPrincipal.xhtml">
        <ui:define name="contenido">
            <f:view>
                <h:form>
                    <h:panelGrid columns="1" style="width: 40%;margin: 0px auto;">
                        <p:commandButton id="btnNuevoTipoCambio" action="#{MBTipoCambio.nuevo()}" value="AGREGAR TIPO DE CAMBIO" ajax="false"/>
                    </h:panelGrid> 
                </h:form>
                <h:form>
                    <p:panel id="pnlBusquedaTipoCambios" header="Consultar Tipo de Cambio" style="width: 40%;margin: 5px auto" 
                             toggleable="true" widgetVar="buscar" collapsed="#{BKTipoCambio.listaTipoCambiosActivos ne null}" >
                        <h:panelGrid columns="2" columnClasses="label, value" styleClass="grid">

                            <h:outputLabel id="lblFechaInicio" value="FECHA INCIO : " class="lblBusqueda" style="font-weight: bold"/>
                            <p:calendar id="txtFechaInicio" locale="es" 
                                        value="#{BKTipoCambio.fechaInicio}" 
                                        pattern="dd/MM/yyyy" 
                                        maxdate="#{BKTipoCambio.fechaFinal}"
                                        showOn="button" showButtonPanel="true" navigator="true">
                                <p:ajax event="dateSelect" listener="#{MBTipoCambio.marcarInicio}" update="txtFechaFinal" />
                            </p:calendar>

                            <h:outputLabel id="lblFechaFinal" value="FECHA FINAL : " class="lblBusqueda" style="font-weight: bold"/>
                            <p:calendar id="txtFechaFinal" locale="es"
                                        value="#{BKTipoCambio.fechaFinal}" 
                                        pattern="dd/MM/yyyy"
                                        mindate="#{BKTipoCambio.fechaInicio}"
                                        showOn="button" showButtonPanel="true" navigator="true">
                                <p:ajax event="dateSelect" listener="#{MBTipoCambio.marcarFinal}" update="txtFechaInicio" />
                            </p:calendar>

                            <p:commandButton id="btnBuscarTipoCambio" value="BUSCAR" update="pnlBusquedaTipoCambios,dataTablaTipoCambios"  
                                             actionListener="#{MBTipoCambio.buscarListaTipoCambios}" styleClass="ui-priority-primary"
                                             oncomplete="listaTiposCambio.show();buscar.toggle()" style="font-size: 12px"/>
                        </h:panelGrid>


                    </p:panel>
                    <p:panel id="pnlListaTiposCambio" header="Lista de Tipos de Cambio" closable="true" style="width: 80%;margin: 10px auto" 
                             visible="#{(BKTipoCambio.listaTipoCambiosActivos eq null)?false:true}" widgetVar="listaTiposCambio" >

                        <p:dataTable id="dataTablaTipoCambios" var="cambio" value="#{BKTipoCambio.listaTipoCambiosActivos}" 
                                     emptyMessage="No se encontraron tipo de cambios"  scrollHeight="250" paginatorPosition="bottom"   
                                     filteredValue="" paginator="true" rows="30" rowIndexVar="rowIndex"
                                     paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} 
                                     {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}" styleClass="datable-busqueda"
                                     rowsPerPageTemplate="30,60,90" scrollable="true" style="width:100%"> 
                            <f:facet name="header" >
                                <p:outputPanel layout="block" >
                                    <h:commandButton value="Exportar EXCEL">  
                                        <p:dataExporter type="xls" target="dataTablaTipoCambios" fileName="tipo_de_cambio" />  
                                    </h:commandButton>  

                                    <h:commandButton value="Exportar PDF">  
                                        <p:dataExporter type="pdf" target="dataTablaTipoCambios" fileName="tipo_de_cambio"/>  
                                    </h:commandButton>
                                </p:outputPanel>

                            </f:facet>


                            <p:column id="idColumnaNum" 	
                                      headerText="Num." style="width: 5%">
                                <h:outputText value="#{rowIndex+1}" /> 
                            </p:column>

                            <p:column id="idColumnaFecCreacionTipoCambio" sortBy="#{cambio.fecCreacion}" style="width: 25%"> 
                                <f:facet name="header">  
                                    <h:outputText value="Fecha" />  
                                </f:facet> 
                                <h:outputText value="#{cambio.fecCreacion}" >
                                    <f:convertDateTime pattern="dd/MM/yyyy" />
                                </h:outputText>

                            </p:column>

                            <p:column id="idColumnaCompraTipoCambio" sortBy="#{cambio.compra}" style="width: 30%"> 
                                <f:facet name="header">  
                                    <h:outputText value="Compra" />  
                                </f:facet> 
                                <h:outputText value="#{cambio.compra}" /> 
                            </p:column>

                            <p:column id="idColumnaVentaTipoCambio" sortBy="#{cambio.venta}" style="width: 30%"> 
                                <f:facet name="header">  
                                    <h:outputText value="Venta" />  
                                </f:facet> 
                                <h:outputText value="#{cambio.venta}" /> 
                            </p:column>

                            <p:column id="idAccionesTipoCambio" headerText="Acciones" style="width: 10%"  exportable="false">
                                <p:commandButton icon="ui-icon-pencil" title="Editar" ajax="false" action="#{MBTipoCambio.editar()}" 
                                                 disabled="#{cambio.fecCreacion ge BKTipoCambio.fechaInicioMes?'false':'true'}">
                                    <f:setPropertyActionListener value="#{cambio}" target="#{BKTipoCambio.tipoCambioFormulario}" />  
                                </p:commandButton>  

                            </p:column>


                        </p:dataTable>	
                    </p:panel>
                </h:form>
            </f:view>
        </ui:define>
    </ui:composition>
</html>   